<template>
	<view class="codepage">
		<canvas class="qrcode top1" canvas-id="qrcode"></canvas>
		<img class="qrcode" :src="img" alt="">
		
		<button type="default">请长按图片保存</button>
		
		<view class="boxes" v-for="(item,index) in list" :key="index">
			<view>医馆名称：{{item.title}}</view>
			<view>联系电话：{{item.tel}}</view>
			<view>入驻时间：{{item.created_at}}</view>
			<view>提成比例：{{item.pbili}}%</view>
			<view>医馆地址：{{item.address}}</view>
		</view>
	</view>
</template>
<script>
	import {
		tzyg
	} from '../../request/api.js'
	import uQRCode from '@/components/Sansnn-uQRCode/uqrcode.js'
	export default {
		data() {
			return {
				img: '',
				list:[]
			}
		},
		onLoad(options) {
			this.make(options.userid);
			this.tzyg();
		},
		methods: {
			tzyg() {
				tzyg({}).then(res => {
					res.data.forEach(item=>{
						item.pbili = item.pbili.split('.')[0]
					})
					this.list = res.data
				})
			},
			make(userid) {
				// 生成二维码 回调方式
				uQRCode.make({
					canvasId: 'qrcode',
					componentInstance: this,
					text: 'http://wsfs.jm120.net/reg/?userid='+userid,
					// text: 'http://36.134.154.147:9091/reg/?userid='+userid,
					// text: 'http://192.168.0.5:8080/reg/?userid='+userid,
					size: 130,
					margin: 10,
					backgroundColor: '#ffffff',
					foregroundColor: '#000000',
					fileType: 'jpg',
					correctLevel: uQRCode.errorCorrectLevel.H,
					success: res => {
						this.img = res
					},
					fail(err) {
						console.log(err, '==============')
					}
				})
			},
		}
	}
</script>

<style scoped lang="less">
	.codepage {
		width: 100%;
		height: 100%;
		position: absolute;
		left: 0;
		top: 0;
		overflow: auto;
		
		.boxes{
			margin: 30rpx 50rpx;
		}

		.qrcode {
			width: 130px;
			height: 130px;
			margin: 50upx auto;
			display: block;
			background-color: #FFFFFF;
		}
		.top1{
			position: absolute;
			top: -500upx;
		}
		button {
			width: 630upx;
			height: 88upx;
			line-height: 88upx;
			background: #F86C53;
			border-radius: 44upx;
			color: #FFFFFF;
			font-size: 36upx;
			font-family: Source Han Sans CN;
			font-weight: 500;
		}

		button:after {
			border: none;
		}
		
		
	}
</style>
